<script lang="ts">
import Vue from 'vue'
import NanExperienceClassData from "@/views/systemTools/systemSalarySettlement/step/step3/nonExperienceClassData/nonExperienceClassData.vue";
import WordShorthand from "@/views/systemTools/systemSalarySettlement/step/step3/nonExperienceClassData/wordShorthand.vue";
import MultiDimensionallistening
  from "@/views/systemTools/systemSalarySettlement/step/step3/nonExperienceClassData/multiDimensionallistening.vue";
import WorryFreeWriting from "@/views/systemTools/systemSalarySettlement/step/step3/nonExperienceClassData/worryFreeWriting.vue";
import SyntaxParsing from "@/views/systemTools/systemSalarySettlement/step/step3/nonExperienceClassData/syntaxParsing.vue";
import ReadingComprehension from "@/views/systemTools/systemSalarySettlement/step/step3/nonExperienceClassData/readingComprehension.vue";
import Cloze from "@/views/systemTools/systemSalarySettlement/step/step3/nonExperienceClassData/Cloze.vue";

export default Vue.extend({
  name: "dirct",
  components: {
    WordShorthand,
    NanExperienceClassData,
    MultiDimensionallistening,
    WorryFreeWriting,
    SyntaxParsing,
    ReadingComprehension,
    Cloze
  },
  props: {
    mapData: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  data() {
    return {
      activeName: 'first'
    };
  },
  methods: {
    handleClick(tab, event) {
    }
  }
})
</script>

<template>
  <el-tabs v-model="activeName" @tab-click="handleClick">
    <el-tab-pane label="全部数据" name="first">
      <nan-experience-class-data :table-data="mapData.nonExperienceClassData"></nan-experience-class-data>
    </el-tab-pane>
    <el-tab-pane label="单词速记" name="second">
      <word-shorthand v-if="activeName === 'second'" :table-data="mapData.nonExperienceClassData"></word-shorthand>
    </el-tab-pane>
    <el-tab-pane label="多维听力" name="third">
      <multi-dimensionallistening v-if="activeName === 'third'" :table-data="mapData.nonExperienceClassData"
      ></multi-dimensionallistening>
    </el-tab-pane>
    <el-tab-pane label="无忧写作" name="fourth">
      <worry-free-writing v-if="activeName === 'fourth'" :table-data="mapData.nonExperienceClassData"
      ></worry-free-writing>
    </el-tab-pane>
    <el-tab-pane label="语法解析" name="five">
      <syntax-parsing v-if="activeName === 'five'" :table-data="mapData.nonExperienceClassData"></syntax-parsing>
    </el-tab-pane>
    <el-tab-pane label="阅读理解" name="six">
      <reading-comprehension v-if="activeName === 'six'" :table-data="mapData.nonExperienceClassData"
      ></reading-comprehension>
    </el-tab-pane>
    <el-tab-pane label="完形填空" name="seven">
      <Cloze v-if="activeName === 'seven'" :table-data="mapData.nonExperienceClassData"
      ></Cloze>
    </el-tab-pane>
  </el-tabs>
</template>

<style scoped lang="scss">

</style>
